﻿<%@ Page Language="C#" AutoEventWireup="true" CodeFile="sysApplicationForm.aspx.cs"
    Inherits="Form_sysApplicationForm" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <%-- <script src="<%=ResolveClientUrl("~/Resource/js/jquery.validate.js")%>" type="text/javascript"></script>--%>
    <script src="<%=ResolveClientUrl("~/Resource/js/benik.js")%>" type="text/javascript"></script>
    <%--<link href="<%=ResolveClientUrl("~/Resource/css/Style.css")%>" rel="stylesheet" type="text/css" />--%>
    <%--<link href="<%=ResolveClientUrl("~/Resource/css/kendo.common.min.css")%>" rel="Stylesheet" type="text/css" />--%>
    <%--<link href="<%=ResolveClientUrl("~/Resource/css/kendo.default.min.css")%>" rel="Stylesheet" type="text/css" /> --%>

       <script src="<%= ResolveUrl("~/Resource/plupload/moxie.min.js") %>" type="text/javascript"></script>
    <script src="<%= ResolveUrl("~/Resource/plupload/plupload.full.min.js") %>" type="text/javascript"></script>

    <script type="text/javascript" language="javascript">
        $(document).ready(function () {
            $("#txtAppName").focus();
            $('#panelbar').kendoPanelBar();
//            $("#btnSave").click(function () {
//                if (!$("#form1").valid())
//                    return;
//                var name = $('#txtAppName').val();
//                var url = $('#txtAppUrl').val();
//                var id = $('#<%= hfID.ClientID %>').val();
//                //alert(id);
//                var objApp = new Object();
//                objApp.AppID = id;
//                objApp.DescApp = encodeURIComponent(name);
//                objApp.UrlApp = encodeURIComponent(url);
//                jsonData = JSON.stringify(objApp);
//                if (id == 0)
//                    CallAjax('<%= ResolveUrl("~/handler/sysApplicationHandler.ashx") %>', "?show=create", jsonData);
//                else
//                    CallAjax('<%= ResolveUrl("~/handler/sysApplicationHandler.ashx") %>', "?show=update", jsonData);

//                parent.$('#dialog').dialog('close');
//                setTimeout(parent.$('#application-grid').data('kendoGrid').dataSource.read(), 3000);
//                setTimeout(parent.$('#application-grid').data('kendoGrid').refresh(), 3000);
//                return false;
//            });

            $('#btnClose').click(function () {
                parent.$('#dialog').dialog('close');
                return false;
            });
        });
    </script>



       <script type="text/javascript">


//           var dom = {

//               uploads: $("ul.uploads")
//           };

//           function showImagePreview(file) {

//               var item = $("<li></li>").prependTo(dom.uploads);
//               var image = $(new Image()).appendTo(item);

//               var preloader = new mOxie.Image();
//               preloader.onload = function () {
//                   preloader.downsize(300, 200);
//                   image.prop("src", preloader.getAsDataURL());

//               };


//               preloader.load(file.getSource());

//           }

           $(document).ready(function () {



               var uploader = new plupload.Uploader({
                   runtimes: 'html5,flash,silverlight',
                   browse_button: 'pickfiles',
                   container: 'container',
                   max_file_size: '5mb',
                   url: '<%= ResolveUrl("~/Handler/sysApplicationHandler.ashx") %>' + '?show=create',
                   flash_swf_url: '<%= ResolveUrl("~/Resource/plupload/Moxie.swf") %>',
                   silverlight_xap_url: '<%= ResolveUrl("~/Resource/plupload/Moxie.xap") %>',
                   filters: [
			        { title: "Image files", extensions: "jpeg,jpg,gif,png" }
		],
                   resize: { width: 300, height: 200, quality: 90 }
               });

               uploader.bind('Init', function (up, params) {

                   var msg = 'Untuk dapat melakukan proses unggah / upload dokumen, browser anda harus mendukung salah satu teknologi, HTML 5 / Flash / Silverlight';

                   if (params.runtime == 'html5') {
                       msg = '';
                   } else if (params.runtime == 'flash') {
                       msg = '';
                   } else if (params.runtime == 'silverlight') {
                       msg = ''
                   }

                   if (msg != '') {
                       alert(msg);
                   }

               });

               uploader.init();

               uploader.bind('FilesAdded', function (up, files) {

                   if (up.files.length > 1) {
                       alert('Hanya diperbolehkan satu file untuk di upload!');
                       return false;
                   }



                   $.each(files, function (i, file) {
                       $('#filelist').append(
                        '<div id="' + file.id + '">' + file.name + ' (' + plupload.formatSize(file.size) + ') <b></b>' + '</div>');
                       
                       $('#<%= hfFileName.ClientID %>').val(file.name);

                       // $('#trImage').hide();
                       //showImagePreview(file);
                   });



                   up.refresh(); // Reposition Flash/Silverlight
               });

               uploader.bind('FileUploaded', function (up, file, info) {

                   var err = JSON.parse(info.response);
                   alert(err.Message);

               });

               uploader.bind('Error', function (up, err) {

                   var errMsg = '';

                   switch (err.code) {
                       case (-600):
                           errMsg = 'File tidak boleh lebih dari 5 Mb';
                           break;
                       case (-601):
                           errMsg = 'File harus berformat  gambar/jpg';
                           break;
                       default:
                           errMsg = err.code + ' - ' + err.message;
                           break;
                   }

                   alert(errMsg);

                   up.refresh(); // Reposition Flash/Silverlight

               });


               // 3. Set the click event to do the validation
               $("#btnSave").click(function () {
                   var id = $('#<%= hfID.ClientID %>').val();
                   var handlerUrl = '<%= ResolveUrl("~/Handler/sysApplicationHandler.ashx") %>';
                   
                   if (id == '') {

                      // alert(uploader.files.length);
                       if (uploader.files.length > 0) // Insert with uploaded file.
                       {
                           uploader.settings.multipart_params = {
                               'txtAppName': encodeURIComponent($('#txtAppName').val()),
                               'txtAppUrl': encodeURIComponent($('#txtAppUrl').val()),
                               'hfID': encodeURIComponent($('#hfID').val()),
                               'hfFileName': encodeURIComponent($('#hfFileName').val()),
                               'txtAppDesc': encodeURIComponent($('#txtAppDesc').val())

                           };

                           uploader.settings.url = handlerUrl + '?show=create';
                           uploader.start();
                       }
                       else {

                           $.post('<%= ResolveUrl("~/Handler/sysApplicationHandler.ashx") %>' + '?show=create',
                                $("#form1")
                                .find("input,textarea,select,hidden")
                                .not("#__VIEWSTATE,#__EVENTVALIDATION")
                                .serialize())
                            .done(function (data) {
                                var r = JSON.parse(data);
                                alert(r.Message);
                            })
                            .fail(function () {
                                alert('Data gagal di simpan!');
                            });

                       }

                   }
                   else {

                       if (uploader.files.length > 0) // Update with uploaded file.
                       {
                           uploader.settings.multipart_params = {
                               'txtAppName': encodeURIComponent($('#txtAppName').val()),
                               'txtAppUrl': encodeURIComponent($('#txtAppUrl').val()),
                               'hfID': encodeURIComponent($('#hfID').val()),
                               'hfFileName': encodeURIComponent($('#hfFileName').val()),
                               'txtAppDesc': encodeURIComponent($('#txtAppDesc').val())
                           };

                           uploader.settings.url = handlerUrl + '?show=update';
                           uploader.start();

                       }
                       else {

                           $.post('<%= ResolveUrl("~/Handler/sysApplicationHandler.ashx") %>' + '?show=update',
                                $("#form1")
                                .find("input,textarea,select,hidden")
                                .not("#__VIEWSTATE,#__EVENTVALIDATION")
                                .serialize())
                            .done(function (data) {
                                var r = JSON.parse(data);
                                alert(r.Message);
                            })
                            .fail(function () {
                                alert('Data gagal di ubah!');
                            });

                       }

                   }

                   parent.$('#dialog').dialog('close');
                   setTimeout(parent.$('#application-grid').data('kendoGrid').dataSource.read(), 3000);
                   setTimeout(parent.$('#application-grid').data('kendoGrid').refresh(), 3000);
                   return false;
               });


           });
    
    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div class="grid-box" id="profileform">
        <h3 id="h3Title" runat="server">
        </h3>
        <input type="hidden" name="ID" />
        <ul id="panelbar">
            <li class="k-state-active"><b>Data Application</b>
                <div class="forminput">
                    <table width="100%" style="background: #FFF; padding: 10px">
                        <tr>
                            <td width="150">
                                <label for="txtAppName">
                                    Title</label>
                            </td>
                            <td>
                                :
                            </td>
                            <td>
                                <%-- <input type="text" class="required" name="txtAppName" id="txtAppName" size="30" />--%>
                                <asp:TextBox ID="txtAppName" runat="server" CssClass="required" Width="200"></asp:TextBox>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <label for="txtAppUrl">
                                    Url</label>
                            </td>
                            <td>
                                :
                            </td>
                            <td>
                                <%-- <input type="text" class="required" name="txtAppUrl" id="txtAppUrl" size="30" />--%>
                                <asp:TextBox ID="txtAppUrl" runat="server" CssClass="required" Width="300"></asp:TextBox>
                            </td>
                        </tr>
                        <tr>
                            <td width="150">
                                <label for="txtAppDesc">
                                    Description</label>
                            </td>
                            <td>
                                :
                            </td>
                            <td>
                                <%-- <input type="text" class="required" name="txtAppName" id="txtAppName" size="30" />--%>
                                <asp:TextBox ID="txtAppDesc" runat="server" TextMode="MultiLine" Width="300"></asp:TextBox>
                            </td>
                        </tr>
                        <tr>
                            <td valign="top">
                                <label for="txtAppImage">
                                    Image</label>
                            </td>
                            <td valign="top">
                                :
                            </td>
                            <td>
                                <div id="container">
                                    <a id="pickfiles" class="plupload_button plupload_add ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-primary"
                                        href="#"><span class="ui-button-icon-primary ui-icon ui-icon-circle-plus" /><span
                                            class="ui-button-text">Browse</span> </a>
                                    <br />
                                    <div id="filelist">
                                    </div>
                                    <ul class="uploads">
                                        <!-- Will be populated dynamically with LI/IMG tags. -->
                                    </ul>
                                </div>
                            </td>
                        </tr>
                    </table>
                </div>
            </li>
        </ul>
        <%--<asp:Button ID="btnClose" runat="server" Text="Close"/>&nbsp;--%>
        <%--<asp:Button ID="btnSave1" runat="server" Text="Save"/>--%>
        <%--<input type="button" value="Save" ID="ProfileSave" />--%>
        <button id="btnClose" type="button">
            Close</button>
        <button id="btnSave" type="button">
            Save</button>
    </div>
    <asp:HiddenField ID="hfID" runat="server" Value="" />
    <asp:HiddenField ID="hfFileName" runat="server" Value="" />
    </form>
</body>
</html>
